<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page trimDirectiveWhitespaces="true"%>
<!DOCTYPE html>
<html lang=ko>
<head>
<meta charset=UTF-8 />
<meta name=viewport content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<meta http-equiv=X-UA-Compatible content="IE=edge,chrome=1" />
<title>라이브러리</title>
<link rel="shortcut icon" href=assets/ico/favicon.png />
<link rel=apple-touch-icon-precomposed href=assets/ico/apple-touch-icon-57-precomposed.png />
<link rel=apple-touch-icon-precomposed sizes=72x72 href=assets/ico/apple-touch-icon-72-precomposed.png />
<link rel=apple-touch-icon-precomposed sizes=114x114 href=assets/ico/apple-touch-icon-114-precomposed.png />
<link rel=apple-touch-icon-precomposed sizes=144x144 href=assets/ico/apple-touch-icon-144-precomposed.png />
<link rel=stylesheet type=text/css href=assets/css/bootstrap.min.css />
<link rel=stylesheet type=text/css href=assets/css/nanumfont.css />
<!--[if lt IE 9]>
<script type=text/javascript src=assets/js/html5shiv.js></script>
<script type=text/javascript src=assets/js/respond.min.js></script>
<![endif]-->
<!--[if gt IE 9]>
<link rel=stylesheet type=text/css href=assets/css/ie10.css />
<script type=text/javascript src=assets/js/ie10.js></script>
<![endif]-->
<link rel=stylesheet type=text/css href=assets/font-awesome-4.0.3/css/font-awesome.min.css />
<style type=text/css>html,body{width:100%;height:100%}body,h1,h3,ul,li{padding:0;margin:0}li{display:inline-block;list-style-type:none;margin-left:5px}a:hover{text-decoration:none}nav.navbar{line-height:50px;background-color:#ff8a00;border-bottom:1px solid #4f2b00}.nav_content{position:relative;max-width:737px;margin:auto;padding-left:5px;padding-right:5px}.nav_menu_btn{width:50px;position:absolute;top:0;left:5px;font-size:25px}.page_title{font-size:20px;color:#fff}.back_btn{color:#fff}.back_btn:hover{color:#333}.panel-group{padding-top:52px}.list_box_style{border-radius:0!important;border-top:0;border-left:none;border-right:0;border-bottom:1px solid #bab8b6}.list-header{line-height:40px;background-color:#d8f6ff;border-bottom:1px dotted #bab8b6}.list-top{max-width:737px;margin:auto;padding-left:5px;padding-right:5px}.top-text-style{position:relative;top:1px}.panel-heading{max-width:737px;margin:auto;padding-top:20px;padding-bottom:20px;padding-left:5px;padding-right:5px;background-color:#ffffff!important}.panel-collapse{background-color:#f5f2f5;border-top:1px dotted #bab8b6}.panel-body{max-width:737px;margin:auto;padding:5px;border-top:none!important}.margin-left-10{margin-left:10px}.icon_style{position:relative;top:-2px;margin-right:2px}</style>
</head>
<body>
<nav class="navbar navbar-fixed-top" role=navigation>
<div class="nav_content text-center">
<div class="nav_menu_btn pull-left text-center">
<a class=back_btn onclick=history.back()><i class="fa fa-arrow-left"></i></a>
</div>
<span class=page_title><strong>경로 라이브러리</strong></span>
</div>
</nav>
<div id=test class=panel-group></div>
<script src=assets/js/jquery.js></script>
<script src=assets/js/bootstrap.min.js></script>
<script type=text/javascript>var dbSize=1*1024*1024;var journeyAlDB=openDatabase("JourneyAlDB","1.0","내 루트 알람DB",dbSize);$(function(){journeyAlDB.transaction(function(h){h.executeSql("SELECT key, is_al, al_info FROM JourneyAlDB",[],function(j,l){for(var m=0;m<l.rows.length;m++){var k='<input type="hidden" id="is_al_';k+=l.rows.item(m).key;k+='" value="';k+=l.rows.item(m).is_al;k+='">';k+='<input type="hidden" id="al_info_';k+=l.rows.item(m).key;k+='" value="';k+=l.rows.item(m).al_info;k+='">';$("body").append(k)}})});var f="";for(var c=0;c<localStorage.length;c++){var e=localStorage.key(c);var b=JSON.parse(localStorage[e]);var g=new Date(e.substring(13,26));f+='<div class="panel panel-default list_box_style">';f+='<div class="list-header">';f+='<div class="list-top">';f+='<span class="label label-info"></span>';f+='<span class="top-text-style"> 출발시간: <strong> '+b.departure_time.text+"</strong></span>";f+='<span class="top-text-style"> 도착시간: <strong> '+b.arrival_time.text+"</strong></span>";f+='<span class="text-danger top-text-style"><strong> 소요시간: '+Math.ceil(b.duration.value/60)+"분 </strong></span>";f+="</div>";f+="</div>";f+='<div class="panel-heading">';f+='<h4 class="panel-title"><a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapse'+c+'">';f+='<div class="list">';for(var d=0;d<b.steps.length;d++){if(b.steps[d].travel_mode=="TRANSIT"){f+='<img style="height: 20px; width: 20px" src="'+b.steps[d].transit.line.vehicle.icon+'">';if(b.steps[d].transit.line.short_name!=null){f+='<span style="background-color:'+b.steps[d].transit.line.color+';padding:0 4px;color:#ffffff">'+b.steps[d].transit.line.short_name+"</span>";f+=b.steps[d].transit.departure_stop.name}else{if(b.steps[d].transit.line.short_name==null){f+='<span style="background-color:#d24999;padding:0 4px;color:#ffffff">'+b.steps[d].transit.line.name+"</span>"}}f+=' <i class="fa fa-caret-right"></i> ';f+=b.steps[d].transit.arrival_stop.name;var a=Math.ceil(b.steps[d].duration.value/60);f+='<span class="text-muted">[약 '+a+"분]</span>";if(d!=((b.steps.length)-1)){f+="<br /><br />"}}else{f+='<img style="height: 20px; width: 20px" src="https://maps.gstatic.com/mapfiles/transit/iw/6/walk.png">';f+=b.steps[d].instructions;var a=Math.ceil(b.steps[d].duration.value/60);f+='<span class="text-muted">[약 '+a+"분]</span>";if(d!=((b.steps.length)-1)){f+="<br /><br />"}}if(d==(b.steps.length)-1&&b.steps.length!=1){f+="</div>"}}f+="</a></h4></div>";f+='<div id="collapse'+c+'" class="panel-collapse collapse">';f+='<div class="panel-body">';f+='<div class="pull-right"><button class="list-btn1 btn btn-info" ';f+='onclick="location.href = ';f+="'journey.jsp?";f+="start="+b.start_location.nb+","+b.start_location.ob;f+="&end="+b.end_location.nb+","+b.end_location.ob;f+="&time="+g.getTime()/1000;f+="&journey="+e.substring(26,27);f+="';return false;\">지도보기</button>";f+='<button id="rselect" class="rselect list-btn2 btn btn-warning margin-left-10" value="'+e+'">경로선택</button>';f+="</div></div></div>"}$("#test").html(f);$(Document).on("click",".rselect",function(){var k=new Date();var j=k.getTime()+""+$(this).val().substring(13,27);var i=$("#is_al_"+$(this).val()).val();var l=$("#al_info_"+$(this).val()).val();localStorage[j]=localStorage[$(this).val()];var h=$(this).val();journeyAlDB.transaction(function(m){m.executeSql("INSERT INTO journeyAlDB(key, is_al, al_info) VALUES (?,?,?)",[j,i,l],function(){},function(n,o){console.log(o.message)})});journeyAlDB.transaction(function(m){m.executeSql("DELETE FROM journeyAlDB WHERE key=?",[h],function(){},function(n,o){console.log(o.message)})});localStorage.removeItem($(this).val());location.href="rout.jsp"})});</script>
</body>
</html>